<template>
  <div class='title' :class="isReverse ? 'reverse': ''">
    {{title}}
  </div>
</template>

<script>
export default {
  data(){
    return{

    }
  },
  props: {
    title: {
      type: String,
      default: '',
    },
    isReverse: {
      type: Boolean,
      default: false
    }
  }
}
</script>

<style scoped>
.title {
  font-family: AlimamaShuHeiTi-Bold;
  font-size: 18px;
  color: #FFFFFF;
  letter-spacing: 1px;
  line-height: 21.95px;
  font-weight: 700;
  background-image: url('../../../assets/img/titleBg.png');
  background-size: 100%;
  padding: 7px 30px;
  text-align:left
}
.reverse{
  background-image: url('../../../assets/img/titleBgRight.png');
  text-align:right
}
</style>